<template>
  <div class="add-new-address">
    <van-address-edit
      :area-list="areaList"
      show-set-default
      :address-info="addresInfo"
      @save="onSave"
      @delete="onDelete"
      @change-area="handleSelectArea"
      @change-detail="onChangeDetail"
    />
  </div>
</template>

<script>
import { areaList } from '@vant/area-data';
import { putAddressService,queryAddressService } from '@/service/user'
export default {
  data() {
    return {
      areaList,
      searchResult: [],
      addresInfo: {},
      areaPlace: ['河南省', '郑州市', '中原区'],
      areaPlaceHolder: '',
      selectArr:[]
    };
  },

  created(){
    this.queryAddressInfo(this.$route.params.id)
  },

  components: {},

  computed: {},

  methods: {
    handleSelectArea(values){
      console.log(values,'handleSelectArea')
      this.selectArr = values
    },
    async queryAddressInfo(id){
      let result = await queryAddressService(id);
      if(result.status == 200){
        let { consignee: name, mobile: tel, province, city, district:county, address:addressDetail, is_default: isDefault } = result.data;
        // this.areaPlace = [result.data.province, result.data.city, result.data.district]
        if(isDefault == 1){
          isDefault = true
        }else{
          isDefault = false
        }
        console.log(province,city, county)
        this.addresInfo = {
          name, tel, province: String(province), city: String(city), county: String(county), addressDetail, isDefault, areaCode: String(county)
        }
        this.selectArr = [province,city, county]
      }
    },
    /**
     * addressDetail: "ces"
areaCode: "110101"
city: "北京市"
country: ""
county: "东城区"
isDefault: true
name: "ces"
postalCode: ""
province: "北京市"
tel: "15093214357"
     */

    async onSave(addressInfo) {
      let { name: consignee, tel: mobile, province, city, county: district, addressDetail: address, isDefault: is_default  } = addressInfo;
      let params = {
        consignee,
        mobile,
        province: this.selectArr[0].code,
        city: this.selectArr[1].code,
        district: this.selectArr[2].code,
        address,
        address_alias:'',
       is_default
      }
      if(params.is_default){
        params.is_default = 1
      }else{
        params.is_default = 0
      }
      let result = await putAddressService(params, this.$route.params.id);
      if(result.status == 200){
        this.$router.go(-1)
      }
      console.log(addressInfo)
    },
    onDelete() {
    },
    onChangeDetail(val) {
      console.log(val)
      if (val) {
        this.searchResult = [
          {
            name: '黄龙万科中心',
            address: '杭州市西湖区',
          },
        ];
      } else {
        this.searchResult = [];
      }
    },
  },
};
</script>
<style lang='less'>
.van-address-edit__buttons{
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  background: #fff;
  height: 70px;
  padding: 10px 30px;
  .van-button{
    border-radius: 5px;
    background: #4ECE40;
    border-color: #4ECE40;
  }
}
</style>